﻿<Window x:Class="TestApplication.RangeSliderTest"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="http://schemas.AvalonControls/AvalonControlsLibrary/Controls"
    Title="RangeSliderTest"
    xmlns:current="clr-namespace:TestApplication">
    
    <Window.Resources>
        
        <ControlTemplate TargetType="{x:Type local:RangeSlider}" x:Key="rangeSliderTemplate">
            <StackPanel Name="PART_RangeSliderContainer">
                <RepeatButton Name="PART_LeftEdge" Background="AliceBlue" Content="click me"/>
                <Thumb Name="PART_LeftThumb" Cursor="SizeWE"/><!--This size of this thumb will auto matically change by the control to 10-->
                <Thumb Name="PART_MiddleThumb" Background="AntiqueWhite" Cursor="ScrollAll" MinWidth="10"/>
                <Thumb Name="PART_RightThumb" Cursor="SizeWE"/><!--This size of this thumb will auto matically change by the control to 10-->
                <RepeatButton Name="PART_RightEdge" Background="AliceBlue" Content="click me"/>
            </StackPanel>
        </ControlTemplate>

    </Window.Resources>

    <DockPanel LastChildFill="True">

        <TextBlock DockPanel.Dock="Top">
            <current:BrowserLink NavigateUri="http://marlongrech.wordpress.com/2007/09/06/wpf-range-slider-control/">For more info click here</current:BrowserLink>
        </TextBlock>

        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="30"/>
                <RowDefinition Height="40"/>
                <RowDefinition Height="3*"/>
                <RowDefinition Height="2*"/>
            </Grid.RowDefinitions>

            <Grid Grid.Row="0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="5*"/>
                    <ColumnDefinition Width="5*"/>
                </Grid.ColumnDefinitions>
                <TextBlock x:Name="rangeSliderSelectedValue1" Grid.Column="0"/>
            <TextBlock x:Name="rangeSliderSelectedValue2" Grid.Column="1"/>
        </Grid>

            <local:RangeSlider x:Name="rangeSlider" Template="{StaticResource rangeSliderTemplate}"
                            Grid.Row="1"/>

            <!--Media player style buttons-->
            <Border Grid.Row="2" Grid.ColumnSpan="3"
                Margin="5"
                CornerRadius="5">
                <WrapPanel>
                    <WrapPanel.Resources>

                        <Style TargetType="{x:Type ButtonBase}" x:Key="buttonGenericPath" >
                            <Setter Property="Width" Value="30"/>
                            <Setter Property="Height" Value="30"/>
                            <Setter Property="Background" Value="Silver" />
                            <Setter Property="Foreground" Value="Black" />
                            <Setter Property="Margin" Value="5, 0"/>
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type ButtonBase}">
                                        <Grid>
                                            <Ellipse Width="25" Height="25" x:Name="outerCircle" 
                                            Fill="{TemplateBinding Background}"/>
                                            <ContentPresenter ContentSource="{TemplateBinding Content}"/>
                                        </Grid>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </WrapPanel.Resources>

                    <!--Full Back Button-->
                    <Button Style="{StaticResource buttonGenericPath}"
                        Command="local:RangeSlider.MoveAllBack" 
                        CommandTarget="{Binding ElementName=rangeSlider}">
                        <Grid VerticalAlignment="Center" HorizontalAlignment="Center">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="1"/>
                                <ColumnDefinition Width="7"/>
                                <ColumnDefinition Width="7"/>
                            </Grid.ColumnDefinitions>
                            <Path Data="M 58,29 L 58,49 L 69,49 L 69,29 L 58,29" 
                              Grid.Column="0"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Fill"
			                  Width="1" Height="12"/>
                            <Path Data="M 59.26349,29.280867 L 58.598318,57.883259 L 37.645404,42.916891 L 59.26349,29.280867" 
                              Grid.Column="1"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                            <Path Data="M 59.26349,29.280867 L 58.598318,57.883259 L 37.645404,42.916891 L 59.26349,29.280867" 
                              Grid.Column="2"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                        </Grid>
                    </Button>

                    <!--Back Button-->
                    <RepeatButton Style="{StaticResource buttonGenericPath}"
                        Command="local:RangeSlider.MoveBack" 
                        CommandTarget="{Binding ElementName=rangeSlider}">
                        <Grid VerticalAlignment="Center" HorizontalAlignment="Center">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="7"/>
                                <ColumnDefinition Width="7"/>
                            </Grid.ColumnDefinitions>

                            <Path Data="M 59.26349,29.280867 L 58.598318,57.883259 L 37.645404,42.916891 L 59.26349,29.280867" 
                              Grid.Column="0"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                            <Path Data="M 59.26349,29.280867 L 58.598318,57.883259 L 37.645404,42.916891 L 59.26349,29.280867" 
                              Grid.Column="1"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                        </Grid>
                    </RepeatButton>

                    <!--Forward Button-->
                    <RepeatButton Style="{StaticResource buttonGenericPath}"
                        Command="local:RangeSlider.MoveForward" 
                        CommandTarget="{Binding ElementName=rangeSlider}">
                        <Grid VerticalAlignment="Center" HorizontalAlignment="Center">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="7"/>
                                <ColumnDefinition Width="7"/>
                            </Grid.ColumnDefinitions>
                            <Path Data="M 58.598318,28.948281 L 58.930904,59.546188 L 81.214163,43.914649 L 58.598318,28.948281" 
                              Grid.Column="0"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                            <Path Data="M 58.598318,28.948281 L 58.930904,59.546188 L 81.214163,43.914649 L 58.598318,28.948281" 
                              Grid.Column="1"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                        </Grid>
                    </RepeatButton>

                    <!--Full Forward Button-->
                    <Button Style="{StaticResource buttonGenericPath}"
                        Command="local:RangeSlider.MoveAllForward" 
                        CommandTarget="{Binding ElementName=rangeSlider}">
                        <Grid VerticalAlignment="Center" HorizontalAlignment="Center">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="7"/>
                                <ColumnDefinition Width="7"/>
                                <ColumnDefinition Width="1"/>
                            </Grid.ColumnDefinitions>
                            <Path Data="M 58.598318,28.948281 L 58.930904,59.546188 L 81.214163,43.914649 L 58.598318,28.948281" 
                              Grid.Column="0"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                            <Path Data="M 58.598318,28.948281 L 58.930904,59.546188 L 81.214163,43.914649 L 58.598318,28.948281" 
                              Grid.Column="1"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Uniform"
			                  Width="7" Height="12"/>
                            <Path Data="M 58,29 L 58,49 L 69,49 L 69,29 L 58,29" 
                              Grid.Column="2"
                              Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=Foreground}" 
			                  VerticalAlignment="Center" 
			                  HorizontalAlignment="Center"
			                  Stretch="Fill"
			                  Width="1" Height="12"/>
                        </Grid>
                    </Button>

                </WrapPanel>
            </Border>

            <TextBlock VerticalAlignment="Center" TextWrapping="Wrap" Grid.Row="3"
                Text="The range slider is just like a normal slider but has 2 thumbs so that the user can select a range...Actually the range slider has 3 thumbs, the range in the middle can also be dragged around...The left and right sides of the range slider are 2 repeat buttons and when the user clicks on these the range selcted will move left or right accordingly... Any comments please post on marlongrech.wordpress.com"/>
            <TextBlock VerticalAlignment="Center" TextWrapping="Wrap" Grid.Row="4" 
                Text="NEW FEATURE... now the range slider support control templates.... have a look at the XAML in the sample app for more info.. or contact me at marlongrech.wordpress.com"/>
    </Grid>

    </DockPanel>
</Window>